<template>
  <div v-loading="dataLoading" class="d_main not">
    <div class="d_header">
      <div class="d_header_title">
        <div class="back pointer" @click="Back">
          <span class="el-icon-arrow-left"></span>
          <p>返回</p>
        </div>
        <h3>生产开单</h3>
      </div>
      <div class="d_header_btn">
        <el-button
          v-if="
            typeStatus === 0 ||
              typeStatus === 2 ||
              typeStatus === 4 ||
              typeStatus === 5
          "
          v-loading="orderLoading"
          type="primary"
          size="small"
          :disabled="orderLoading"
          @click="saveOrder"
        >保存</el-button>
        <el-button
          v-if="typeStatus === 3"
          v-loading="orderLoading"
          type="primary"
          size="small"
          :disabled="orderLoading"
          @click="confirmOrder"
        >确认</el-button>
      </div>
    </div>
    <div class="subTip">
      <dl>
        <dt>单据单号</dt>
        <dd>{{ productFrom.baseData.produceTaskBillNo || "系统自动生成" }}</dd>
      </dl>
      <dl>
        <dt>创建日期</dt>
        <dd>{{ productFrom.baseData.createDate || dayjs().format("YYYY-MM-DD") }}</dd>
      </dl>
      <dl>
        <dt>创建人员</dt>
        <dd>{{ productFrom.baseData.createPersonName || name }}</dd>
      </dl>
    </div>
    <div class="d_mainCenter">
      <el-form
        ref="orderForm"
        label-position="left"
        :model="productFrom"
        :rules="rules"
        label-width="110px"
        class="orderForm"
      >
        <div class="d_left p0">
          <div class="d_orderDetails">
            <div class="item">
              <div class="cTitle">
                <h3>订单信息</h3>
              </div>
              <dl>
                <dt>订单单号</dt>
                <dd>{{ productFrom.orderBaseData.xieYiShuHao || '--' }}</dd>
              </dl>
              <dl>
                <dt>客户单号</dt>
                <dd>{{ productFrom.orderBaseData.customerBillNo || '--'}}</dd>
              </dl>
              <dl>
                <dt>合同号</dt>
                <dd>{{ productFrom.orderBaseData.contractCode || '--'}}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>产品信息</h3>
              </div>
              <dl>
                <dt>产品名称</dt>
                <dd>{{ productFrom.orderBaseData.orderProductName || '--' }}</dd>
              </dl>
              <dl>
                <dt>产品板面</dt>
                <dd> {{ productFrom.orderBaseData.printingSurface || '--' }}</dd>
              </dl>
              <dl>
                <dt>产品版本</dt>
                <dd> {{ productFrom.orderBaseData.productVersions || '--' }}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>业务信息</h3>
              </div>
              <dl>
                <dt>标签套数</dt>
                <dd>{{ productFrom.orderBaseData.taoZhuangQuantity || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl>
                <dt>标签枚数</dt>
                <dd>{{ productFrom.orderBaseData.tagSumQuantity || '--' }}<span class="unit">枚</span></dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>数据信息</h3>
              </div>
              <dl>
                <dt>数据来源</dt>
                <dd>{{ productFrom.orderBaseData.dataComeFromName || '--' }}</dd>
              </dl>
              <dl>
                <dt>数据数量</dt>
                <dd>{{ productFrom.orderBaseData.tagDataQuantity || '--' }}</dd>
              </dl>
              <dl>
                <dt>数据状态</dt>
                <dd>{{ productFrom.orderBaseData.dataProduceState || '--' }}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>套装关系</h3>
              </div>
              <labelTree :tree-data="productFrom.packageRelations" />
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>产品包装</h3>
              </div>
              <dl>
                <dt>成品样式</dt>
                <dd>{{ productFrom.packageData.productStyleName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle !== 1">
                <dt>出标方向</dt>
                <dd>{{ productFrom.packageData.outDirectionName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle === 2">
                <dt>卷向</dt>
                <dd>{{ productFrom.packageData.scrollDirectionName || '--' }}</dd>
              </dl>
              <dl>
                <dt>贴标方式</dt>
                <dd>{{ productFrom.packageData.tagAffixWayName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle === 2">
                <dt>卷芯大小</dt>
                <dd> {{ productFrom.packageData.mandrelSize || '--' }}<span class="unit">mm</span></dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle === 2">
                <dt>外直径不超过</dt>
                <dd>{{ productFrom.packageData.notOverDiameter || '--' }}<span class="unit">mm</span></dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle === 2">
                <dt>每卷等于</dt>
                <dd>{{ productFrom.packageData.pageEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle !== 2">
                <dt>每张等于</dt>
                <dd>{{ productFrom.packageData.pageEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl v-if="productFrom.packageData.productStyle !== 2">
                <dt>每包等于</dt>
                <dd>{{ productFrom.packageData.packageEqualPages || '--' }}<span class="unit">张</span></dd>
              </dl>
              <dl>
                <dt>每箱等于</dt>
                <dd>{{ productFrom.packageData.boxEqualPackages || '--' }}<span class="unit">{{ productFrom.packageData.productStyle !== 2 ? "包" : "卷" }}</span></dd>
              </dl>
              <dl>
                <dt>每箱共计</dt>
                <dd>{{ productFrom.packageData.boxEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>订单备注</h3>
              </div>
              <div class="d_remark">
                {{ productFrom.orderBaseData.orderRemark }}
              </div>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>其他信息</h3>
              </div>
              <dl>
                <dt>业务员</dt>
                <dd>{{ productFrom.orderBaseData.salesmanName || '--' }}</dd>
              </dl>
              <dl>
                <dt>联系电话</dt>
                <dd>{{ productFrom.orderBaseData.salesmanMobile || '--' }}</dd>
              </dl>
            </div>
          </div>
        </div>
        <div class="d_tag">
          <div class="d_nav d_nav_m">
            <span :class="conIndex === 0 ? 'on' : ''"  @click="selectChange(0)">彩稿信息</span>
            <span :class="conIndex === 1 ? 'on' : ''"  @click="selectChange(1)">标签信息</span>
          </div>
          <div class="d_tag_item" v-show="conIndex === 0">
            <div class="cTitle">
              <h3>彩稿信息</h3>
            </div>
            <div class="coloredDrawing">
              <template v-if="urlList && urlList.length > 0">
                <ul class="list list_2">
                  <li v-for="imgsrc in urlList" :key="imgsrc">
                    <el-image
                      :src="imgsrc"
                      :initial-index="4"
                      fit="cover"
                    />
                    <i class="iconfont yulanIco"  @click="previewColor(imgsrc.draftFilePreviewUrl)"/>
                  </li>
                </ul>
              </template>
              <template v-else>
                <el-empty  description="暂无彩稿图" />
              </template>
            </div>
            <div class="cTitle">
              <h3>颜色信息</h3>
            </div>
            <div
              v-for="(item, index) in productFrom.orderTagDataList"
              :key="item.productTagCode"
              class="layerTable"
            >
              <div v-if="index === 0" class="">
                <el-table
                  :data="item.colorDataList"
                  fit
                  style="width: 100%"
                >
                  <el-table-column
                    prop="colorValue"
                    label="印刷色"
                    width="100"
                  >
                    <template scope="{row}">
                      {{ row.colorValue || "--" }}
                    </template>
                  </el-table-column>
                  <el-table-column
                  prop="colorTypeName"
                  label="颜色类型"
                  width="110"
                />
                <el-table-column
                  label="颜色名称"
                  prop="colorName"
                  width="110"
                />
                  <el-table-column
                    prop="colorReferenceName"
                    label="参考"
                    width="100"
                  >
                    <template scope="{row}">
                      {{ row.colorReferenceName || "--" }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="colorRemark"
                    label="备注"
                    width="auto"
                  >
                    <template scope="{row}">
                      {{ row.colorRemark || "--" }}
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </div>
          <div class="d_tag_item" v-show="conIndex === 1">
            <div class="cTitle">
              <h3>标签信息</h3>
            </div>
            <div class="tagCon">
              <LableShow :dataArr="productFrom.orderTagDataList"></LableShow>
            </div>
          </div>
        </div>
        <div class="d_content oh-y">
          <div class="cTitle">
            <h3>拼版信息</h3>
          </div>
          <div>
            <ul class="list list_3">
              <li>
                <el-form-item label="版辊尺寸">
                  <el-input
                    v-model="productFrom.baseData.makeup_RollSize"
                    v-toFixed="3"
                    placeholder="请输入长度"
                    size="mini"
                    :disabled="isDisable"
                  >
                    <template slot="append">mm</template>
                  </el-input>
                </el-form-item>
              </li>
              <li>
                <el-form-item label="数码板面">
                  <el-input
                    v-model="productFrom.baseData.makeup_DigitalEdition"
                    v-toFixed="3"
                    placeholder="请输入长度"
                    size="mini"
                    :disabled="isDisable"
                  >
                    <template slot="append">mm</template>
                  </el-input>
                </el-form-item>
              </li>
              <li>
                <el-form-item label="跳距">
                  <el-input
                    v-model="productFrom.baseData.makeup_SkipDistance"
                    placeholder="请输入长度"
                    size="mini"
                    :disabled="isDisable"
                  >
                    <template slot="append">mm</template>
                  </el-input>
                </el-form-item>
              </li>
              <li>
                <el-form-item label="间距">
                  <el-input
                    v-model="productFrom.baseData.makeup_SpaceBetween"
                    placeholder="请输入长度"
                    size="mini"
                    :disabled="isDisable"
                  >
                    <template slot="append">mm</template>
                  </el-input>
                </el-form-item>
              </li>
              <li>
                <el-form-item label="拼版">
                  <el-input
                    v-model="productFrom.baseData.makeup_Combine"
                    placeholder="请输入内容"
                    size="mini"
                    :disabled="isDisable"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item label="模数">
                  <el-input
                    v-model="productFrom.baseData.makeup_Modules"
                    placeholder="请输入内容"
                    size="mini"
                    :disabled="isDisable"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item label="平张断张">
                  <el-input
                    v-model="productFrom.baseData.makeup_PzDz"
                    placeholder="请输入内容"
                    size="mini"
                    :disabled="isDisable"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item label="色数">
                  <el-input
                    v-model="productFrom.baseData.makeup_Colors"
                    placeholder="请输入内容"
                    size="mini"
                    :disabled="isDisable"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item label="计划成品米数" class="PBinfo">
                  <el-input
                    v-model="productFrom.baseData.planCpMeters"
                    v-toFixed="3"
                    placeholder="请输入"
                    size="mini"
                    :disabled="isDisable"
                  >
                    <template slot="append">米</template>
                  </el-input>
                </el-form-item>
              </li>
            </ul>
          </div>
          <div class="cTitle">
            <h3>生产工艺</h3>
            <el-button
              v-if="
                typeStatus === 0 ||
                typeStatus === 2 ||
                typeStatus === 4 ||
                typeStatus === 5
                    "
              type="text"
              @click="showCraft = true"
              style="color:#3f61f1;"
            >
              <i class="iconfont xinjian" />
              <p>选择工艺</p>
            </el-button>
          </div>
          <!-- 表格区域       -->
          <div class="tableCon">
            <div class="tableDiv">
              <div class="table-column-group">
                <div class="table-column not" style="width:22px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:100px"></div>
                <div class="table-column" style="width:100px"></div>
                <div class="table-column" style="width:110px"></div>
                <div class="table-column" style="width:80px"></div>
                <div class="table-column" ></div>
                <div class="table-column" style="width:38px"></div>
              </div>
              <div class="table-header-group">
                <ul>
                  <li></li>
                  <li>工艺编号</li>
                  <li>工艺名称</li>
                  <li>工艺设备</li>
                  <li>计划工时</li>
                  <li>标准效率</li>
                  <li>备注</li>
                  <li
                    v-if="
                          typeStatus === 0 ||
                          typeStatus === 2 ||
                          typeStatus === 4 ||
                          typeStatus === 5
                        "
                  >操作</li>
                </ul>
              </div>
              <div class="table-row-group" id="dragList">
                <template v-for="(cl, index) in productFrom.produceCraftList">
                  <ul :key="index">
                    <li class="textCenter my-handle pointer"><i class="iconfont extend"/></li>
                    <li>{{ cl.produceCraft.produceCraftNo }}</li>
                    <li>{{ cl.produceCraft.produceCraftName }}</li>
                    <li>
                      <el-select
                        filterable
                        v-model="cl.produceCraft.produceEquipment"
                        placeholder="请选择设备"
                        clearable
                        filterable
                        size="mini"
                        :disabled="isDisable"
                        @change="changDviesAndCraf"
                      >
                        <el-option
                          v-for="op in cl.craftEquipments"
                          :key="op.equipmentCode"
                          :label="op.equipmentName"
                          :value="op.equipmentCode"
                        />
                      </el-select>
                    </li>
                    <li>
                      <el-input
                        v-model="cl.produceCraft.craftTaskPlanUseTime"
                        v-toFixed="3"
                        placeholder="请输入内容"
                        size="mini"
                        :disabled="isDisable"
                      >
                        <template slot="append">分钟</template>
                      </el-input>
                    </li>
                    <li>{{ getstandardEfficiency(cl.produceCraft.craftTaskPlanUseTime) }}</li>
                    <li>
                      <el-input
                        v-model="cl.produceCraft.craftTaskRemark"
                        placeholder="请输入内容"
                        size="mini"
                        :disabled="isDisable"
                      />
                    </li>
                    <li
                      v-if="
                              typeStatus === 0 ||
                              typeStatus === 2 ||
                              typeStatus === 4 ||
                              typeStatus === 5
                            "
                      class="textCenter"
                    >
                       <span
                         class="pointer mr5"
                         @click="craftDelete(cl, index)"
                       ><i
                         class="el-icon-delete"
                       /></span>
                    </li>
                  </ul>
                </template>
              </div>
            </div>
          </div>
          <div class="cTitle">
            <h3>生产物料</h3>
            <el-button
              v-if="
                typeStatus === 0 ||
                typeStatus === 2 ||
                typeStatus === 4 ||
                typeStatus === 5
                    "
              type="text"
              @click="selectshowMateria"
              style="color:#3f61f1;"
            >
              <i class="iconfont xinjian" />
              <p>选择物料</p>
            </el-button>
          </div>
          <!-- 表格区域       -->
          <div class="tableCon">
            <div class="tableDiv">
              <div class="table-column-group">
                <div class="table-column" style="width:80px"></div>
                <div class="table-column" style="width:120px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:76px"></div>
                <div class="table-column" style="width:110px"></div>
                <div class="table-column" ></div>
                <div class="table-column" style="width:38px"></div>
              </div>
              <div class="table-header-group">
                <ul>
                  <li>物料编号</li>
                  <li>物料名称</li>
                  <li>规格型号</li>
                  <li>物料类型</li>
                  <li>库存数量</li>
                  <li>计划用料</li>
                  <li>打印用料</li>
                  <li>使用工艺</li>
                  <li>备注</li>
                  <li
                    v-if="
                          typeStatus === 0 ||
                          typeStatus === 2 ||
                          typeStatus === 4 ||
                          typeStatus === 5
                        "
                  >操作</li>
                </ul>
              </div>
              <div class="table-row-group">
                <template v-for="(cl, index) in productFrom.produceMaterialList">
                  <ul :key="index">
                    <li>{{ cl.goodsCode }}</li>
                    <li>{{ cl.goodsName }}</li>
                    <li>{{ cl.stockGoodsName }}</li>
                    <li>{{ cl.categoryName }}</li>
                    <li>{{ cl.stockQuantity }}</li>
                    <li>
                      <el-input
                        v-model="cl.planMaterialQuantity"
                        placeholder="请输入内容"
                        size="mini"
                        :disabled="isDisable"
                      />
                    </li>
                    <li>
                      <el-input
                        v-model="cl.printMaterialQuantity"
                        placeholder="请输入内容"
                        size="mini"
                        :disabled="isDisable"
                      />
                    </li>
                    <li>
                      <el-select
                        filterable
                        v-model="cl.craftTaskClientNo"
                        placeholder="请选择工艺"
                        clearable
                        filterable
                        size="mini"
                        :disabled="isDisable"
                        @change="changDviesAndCraf"
                        @focus="fillSelect"
                      >
                        <el-option
                          v-for="(op, index) in selectArr"
                          :key="index"
                          :label="op.name"
                          :value="op.craftTaskClientNo"
                        />
                      </el-select>
                    </li>
                    <li>
                      <el-input
                        v-model="cl.produceMaterialRemark"
                        placeholder="请输入"
                        size="mini"
                        :disabled="isDisable"
                      />
                    </li>
                    <li
                      v-if="
                              typeStatus === 0 ||
                              typeStatus === 2 ||
                              typeStatus === 4 ||
                              typeStatus === 5
                            "
                      class="textCenter"
                    >
                       <span
                         class="pointer mr5"
                         @click="matairDelete(index)"
                       ><i
                         class="el-icon-delete"
                       /></span>
                    </li>
                  </ul>
                </template>
              </div>
            </div>
          </div>
          <div class="cTitle">
            <h3>生产备注</h3>
          </div>
          <div class="d_remark">
            <el-input
              v-model="productFrom.baseData.produceRemark"
              type="textarea"
              :autosize="{ minRows: 5

                  }"
              placeholder="请输入内容"
              size="mini"
              :disabled="isDisable"
            />
          </div>
        </div>
      </el-form>
    </div>

    <!--   生产工艺on -->
    <SelectCraftlist
      ref="selectCrafList"
      :per-visible.sync="showCraft"
      @refuseLists="refuseListsAll"
    />
    <!--   选择物料  -->
    <SelectMateriaList
      ref="materiaList"
      :per-visible.sync="showMateria"
      @getMateriListData="refuseListsMateriAll"
    />
    <el-image-viewer
      v-show="isShadeShow"
      style="z-index: 5000"
      :initial-index="0"
      :on-close="onCloseviewer"
      :url-list="urlList"
    />
  </div>
</template>
<script>
import SelectCraftlist from '@/components/selectCraft'
import SelectMateriaList from '@/components/selectMaterial'
import labelTree from '@/components/labelTree'
import LableShow from '@/components/lableShow'
import { mapGetters } from 'vuex'
import { uuid } from 'vue-uuid'
import Sortable from 'sortablejs'
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
export default {
  name: '',
  components: { labelTree, SelectCraftlist, SelectMateriaList, ElImageViewer,LableShow },
  computed: {
    ...mapGetters(['userInfo', 'name']),
    getstandardEfficiency() {
      return function(index) {
        if ((this.productFrom.baseData.planCpMeters === 0 || index === 0)) {
          return 0
        } else {
          return (this.productFrom.baseData.planCpMeters / index * 60).toFixed(0)
        }
      }
    }
  },
  data() {
    return {
      orderInfos: {
        productData: {
          tagDataList: [{}, {}, {}]
        }
      },
      selectArr: [],
      isShadeShow: false,
      urlList: [], // 图片列表
      showViewer: false, // 预览图片
      showOrder: false, // 订单弹窗
      showCraft: false, // 选择工艺
      showMateria: false, // 选择物料
      orderNo: '', // 订单号
      loading: null,
      conIndex: 0,
      tabsIndex: 0, // 右侧tabs切换索引
      tagIndex: 0, // 当前标签索引
      colorOps: 'add', // 印刷颜色当前操作
      colorEditIndex: null, // 印刷颜色修改的索引
      dataLoading: false, // 订单详情数据加载
      orderLoading: false, // 订单保存加载效果
      isAddColor: false, // 印刷颜色新增弹框是否打开

      // 设置时间控件小于当前日期不能选择
      option: {
        disabledDate: (time) => {
          return time.getTime() < Date.now() - 1 * 24 * 3600 * 1000
        }
      },
      productFrom: {
        baseData: {},
        packageData: {},
        orderBaseData: {}
      },
      isDisable: false, // 是否禁用输入框
      typeStatus: 0,
      rules: {
        'productBase.customerName': [
          { required: true, message: '请选择客户', trigger: 'change' }
        ],
        'productBase.productName': [
          {
            required: true,
            message: '请输入产品名称',
            trigger: ['change', 'blur']
          }
        ]
      }
    }
  },
  created() {
    this.getTypeStatus()
    this.loading = this.$loading({
      lock: true,
      text: '数据加载中',
      spinner: 'el-icon-loading',
      fullscreen: true,
      background: 'rgba(0, 0, 0, 0.7)'
    })
  },
  deactivated() {
    // localStorage.removeItem('orderInit')
  },
  beforeDestroy() {
    // localStorage.removeItem('orderInit')
  },
  mounted() {
    this.setSort()
  },
  methods: {
    getTypeStatus() {
      this.typeStatus = Number(this.$route.query.typeStatus)
      if (Number(this.$route.query.typeStatus) === 0) {
        this.getOrderDetail()
      } else if (Number(this.$route.query.typeStatus) === 1) {
        this.isDisable = true
        this.getTaskBillDetail()
      } else if (Number(this.$route.query.typeStatus) === 2) {
        this.getTaskBillDetail()
      } else if (Number(this.$route.query.typeStatus) === 3) {
        this.isDisable = true
        this.getTaskBillDetail()
      } else if (Number(this.$route.query.typeStatus) === 4) {
        this.getCreateProduceTaskBill()
      } else if (Number(this.$route.query.typeStatus) === 5) {
        this.getCopyOrderDetail()
      }
    },
    selectshowMateria() {
      if (
        this.productFrom.produceCraftList.length <= 0 &&
          this.isDisable !== true
      ) {
        this.$message({
          type: 'error',
          message: '请先选择生产工艺!'
        })
        return
      } else {
        this.showMateria = true
        // this.productFrom.produceMaterialList.forEach(e => {
        //   e.craftTaskClientNo = ''
        // })
      }
    },
    // 右侧tab切换
    tabChange(index) {
      if (index === 1) {
        if (
          this.productFrom.produceCraftList.length <= 0 &&
          this.isDisable !== true
        ) {
          this.$message({
            type: 'error',
            message: '请先选择生产工艺!'
          })
          return
        } else {
          // this.productFrom.produceMaterialList.forEach(e => {
          //   e.craftTaskClientNo = ''
          // })
        }
      }
      this.fillSelect()
      this.tabsIndex = index
    },
    selectChange(index) {
      this.conIndex = index
    },
    //
    changDviesAndCraf() {
      // this.fillSelect()
    },
    // 预览彩稿
    previewColor(url) {
      this.isShadeShow = true
      this.colorImagUrl = url
    },
    getName(arr, code) {
      let name = ''
      arr.forEach((e) => {
        if (e.equipmentCode === code) {
          name = e.equipmentName
        }
      })
      return name
    },
    fillSelect() {
      const _selectArr = []
      for (
        let index = 0;
        index < this.productFrom.produceCraftList.length;
        index++
      ) {
        const _a = {}
        _a.craftTaskClientNo =
          this.productFrom.produceCraftList[
            index
          ].produceCraft.craftTaskClientNo
        _a.name =
          this.productFrom.produceCraftList[index].produceCraft
            .produceCraftName +
          '/' +
          this.getName(
            this.productFrom.produceCraftList[index].craftEquipments,
            this.productFrom.produceCraftList[index].produceCraft
              .produceEquipment
          )
        // this.productFrom.produceCraftList[
        //   index
        // ].produceCraft.craftTaskClientNo = _a.craftTaskClientNo
        _selectArr.push(_a)
      }
      this.selectArr = _selectArr
    },
    // 获取订单详情
    getOrderDetail() {
      const parmas = {
        saleOrderNo: this.$route.query.orderNo
      }
      this.$api.product
        .AutoCreateProduceTaskBill(parmas)
        .then((res) => {
          this.productFrom = res
          this.showColorDrafts()
          this.loading.close()
        })
        .catch(() => {
          this.loading.close()
        })
    },
    // 根据老生产单复制创建新的生产任务单
    getCreateProduceTaskBill() {
      const parmas = {
        produceTaskBillNo: this.$route.query.produceTaskBillNo
      }
      this.$api.product
        .CopyCreateProduceTaskBill(parmas)
        .then((res) => {
          this.productFrom = res
          this.showColorDrafts()
          res.produceCraftList.forEach((n) => {
            n.produceCraft.craftTaskClientNo = n.produceCraft.craftTaskClientNo
              ? n.produceCraft.craftTaskClientNo
              : uuid.v4()
          })
          res.produceMaterialList.forEach((e) => {
            res.produceCraftList.forEach((n) => {
              if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
                n.produceCraft.craftTaskClientNo = e.craftTaskClientNo
                this.selectArr.push({
                  name:
                    n.produceCraft.produceCraftName +
                    '/' +
                    this.getName(
                      n.craftEquipments,
                      n.produceCraft.produceEquipment
                    ),
                  craftTaskClientNo: e.craftTaskClientNo
                })
              }
            })
          })
          this.loading.close()
        })
        .catch(() => {
          this.loading.close()
        })
    },
    // 生产任务单明细数据
    getTaskBillDetail() {
      const parmas = {
        produceTaskBillNo: this.$route.query.produceTaskBillNo,
        produceTaskID: this.$route.query.produceTaskID
      }
      this.$api.product
        .GetProduceTaskBillDetail(parmas)
        .then((res) => {
          this.productFrom = res
          this.showColorDrafts()
          res.produceCraftList.forEach((n) => {
            n.produceCraft.craftTaskClientNo = n.produceCraft.craftTaskClientNo
              ? n.produceCraft.craftTaskClientNo
              : uuid.v4()
          })
          res.produceMaterialList.forEach((e) => {
            res.produceCraftList.forEach((n) => {
              if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
                n.produceCraft.craftTaskClientNo = e.craftTaskClientNo
                this.selectArr.push({
                  name:
                    n.produceCraft.produceCraftName +
                    '/' +
                    this.getName(
                      n.craftEquipments,
                      n.produceCraft.produceEquipment
                    ),
                  craftTaskClientNo: e.craftTaskClientNo
                })
              }
            })
          })
          this.loading.close()
        })
        .catch(() => {
          this.loading.close()
        })
    },
    // 复制
    getCopyOrderDetail() {
      const parmas = {
        saleOrderNo: this.$route.query.saleOrderNo
      }
      const parmast = {
        produceTaskBillNo: this.$route.query.produceTaskBillNo,
        produceTaskID: this.$route.query.produceTaskID
      }
      this.$api.product
        .AutoCreateProduceTaskBill(parmas)
        .then((copy) => {
          this.$api.product
            .GetProduceTaskBillDetail(parmast)
            .then((info) => {
              info.baseData.produceTaskID = copy.baseData.produceTaskID
              info.produceCraftList.forEach((n) => {
                n.produceCraft.craftTaskClientNo = n.produceCraft
                  .craftTaskClientNo
                  ? n.produceCraft.craftTaskClientNo
                  : uuid.v4()
              })
              info.produceMaterialList.forEach((e) => {
                info.produceCraftList.forEach((n) => {
                  if (n.produceCraft.craftTaskNo === e.craftTaskNo) {
                    n.produceCraft.craftTaskClientNo = e.craftTaskClientNo
                    this.selectArr.push({
                      name:
                        n.produceCraft.produceCraftName +
                        '/' +
                        this.getName(
                          n.craftEquipments,
                          n.produceCraft.produceEquipment
                        ),
                      craftTaskClientNo: e.craftTaskClientNo
                    })
                  }
                })
              })
              this.productFrom = info
              this.showColorDrafts()
              this.loading.close()
            })
            .catch(() => {
              this.loading.close()
            })
        })
        .catch(() => {
          this.loading.close()
        })
    },
    onCloseviewer() {
      this.isShadeShow = false
    },
    showColorDrafts() {
      const parmas = {
        orderNo: this.productFrom.orderBaseData.orderNo
      }
      this.$api.product
        .QueryOrdersColorDrafts(parmas)
        .then((res) => {
          if (res.fileDataList && res.fileDataList.length) {
            const ur = []
            res.fileDataList.forEach((e) => {
              ur.push(e.draftFilePreviewUrl)
            })
            this.$nextTick(() => {
              this.urlList = ur
              // this.showViewer = true
            })
          } else {
            // this.$message({
            //   type: 'error',
            //   message: '暂无彩稿'
            // })
          }
        })
        .catch(() => {})
    },
    // 选择订单
    selectCurrentRow() {},
    // 确认订单
    confirmOrder() {
      const parmas = {
        produceTaskID: this.productFrom.baseData.produceTaskID
      }
      this.$api.product
        .SureProduceTaskBill(parmas)
        .then((res) => {
          this.$router.go(-1)
        })
        .catch(() => {})
    },
    // 选择工艺
    refuseListsAll(val) {
      const parmas = {
        craftCodes: []
      }
      val.forEach((i) => {
        parmas.craftCodes.push(i.code)
      })
      this.$api.product
        .SureChooseProduceCraftEquipmentMaps(parmas)
        .then((res) => {
          const _data = []
          res.forEach((e) => {
            const _ar = {
              produceCraft: {},
              craftEquipments: []
            }
            console.log(_ar, 888, e)
            _ar.produceCraft.produceCraftName = e.craftName
            _ar.produceCraft.produceCraftNo = e.craftCode
            _ar.produceCraft.craftTaskClientNo = uuid.v4()
            _ar.produceCraft.craftTaskPlanUseTime = 0
            _ar.produceCraft.standardEfficiency = 0
            _ar.produceCraft.craftTaskRemark = ''
            _ar.craftEquipments = e.craftEquipments
            _ar.produceCraft.produceEquipment = e.craftEquipments[0] ? e.craftEquipments[0].equipmentCode : ''
            _ar.produceCraft.produceEquipmentName = e.craftEquipments[0] ? e.craftEquipments[0].equipmentName : ''
            console.log(_ar, 888)
            _data.push(_ar)
          })
          console.log(_data)
          _data.forEach((e) => {
            this.productFrom.produceCraftList.push(e)
          })
        })
        .catch(() => {})
    },
    // 选择物料
    refuseListsMateriAll(val) {
      const _data = []

      val.forEach((e) => {
        const _ar = {
          goodsName: '',
          goodsCode: '',
          stockGoodsCode: '',
          stockGoodsName: '',
          specificationName: '',
          categoryName: '',
          stockQuantity: 0,
          planMaterialQuantity: 0,
          printMaterialQuantity: 0,
          produceMaterialRemark: ''
        }
        _ar.stockGoodsCode = e.stockGoodsCode
        _ar.goodsCode = e.goodsCode
        _ar.stockGoodsName = e.stockGoodsName
        _ar.stockQuantity = e.stockSumQuantity
        _ar.goodsName = e.goodsName
        _ar.specificationName = e.specificationName
        _ar.categoryName = e.categoryName
        _data.push(_ar)
      })
      _data.forEach((e) => {
        this.productFrom.produceMaterialList.push(e)
      })
    },
    // 删除工艺
    craftDelete(cl, index) {
      this.$confirm('是否删除该工艺?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const _status = this.productFrom.produceMaterialList.some(
          (item) => item.craftTaskClientNo === cl.produceCraft.craftTaskClientNo
        )
        if (_status) {
          this.$message({
            type: 'error',
            message: '有引用的生产物料，请先删除!'
          })
          return
        } else {
          this.productFrom.produceCraftList.splice(index, 1)
          this.$message({
            type: 'success',
            message: '删除成功!'
          })
        }
      })
    },
    // 删除物料
    matairDelete(index) {
      this.$confirm('是否删除该物料?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.productFrom.produceMaterialList.splice(index, 1)
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      })
    },
    setSort() {
      const el = document.getElementById('dragList')
      Sortable.create(el, {
        ghostClass: 'sortable-ghost', // 放置占位符的类名
        handle: '.my-handle',
        onUpdate: (evt) => {
          const targetRow = this.productFrom.produceCraftList.splice(
            evt.oldIndex,
            1
          )[0]
          this.productFrom.produceCraftList.splice(evt.newIndex, 0, targetRow)
          const newArray = this.productFrom.produceCraftList.slice(0)
          this.productFrom.produceCraftList = []
          newArray.forEach((m, x) => {
            m.produceCraft.produceCraftSort = x+1
          })
          this.$nextTick(() => {
            this.productFrom.produceCraftList = newArray
          })
        }
      })
    },

    // 开单保存
    saveOrder() {
      if(this.productFrom.produceMaterialList.length<1){
        this.$message.warning('请选择生产物料')
        return
      }
      const _data = {}
      const productTagCodes = []
      const produceMaterials = []
      const produceCrafts = []
      const {
        outDirectionName,
        productStyleName,
        scrollDirectionName,
        tagAffixWayName,
        ..._producePackage
      } = this.productFrom.packageData
      _producePackage.saleOrderNo = this.productFrom.orderBaseData.orderNo
      this.productFrom.orderTagDataList.forEach((e) => {
        productTagCodes.push(e.productTagCode)
      })
      this.productFrom.produceMaterialList.forEach((e) => {
        const _mater = {
          stockGoodsCode: '',
          planUseQuantity: 0,
          materialRemark: ''
        }
        _mater.stockGoodsCode = e.stockGoodsCode
        _mater.planUseQuantity = Number(e.planMaterialQuantity)
        _mater.printMaterialQuantity = Number(e.printMaterialQuantity)
        _mater.materialRemark = e.produceMaterialRemark
        _mater.craftTaskClientNo = e.craftTaskClientNo || ''
        produceMaterials.push(_mater)
      })
      this.productFrom.produceCraftList.forEach((e) => {
        // eslint-disable-next-line no-unused-vars
        const { produceCraftName, ...carft } = e.produceCraft

        if ((this.productFrom.baseData.planCpMeters === 0 || carft.craftTaskPlanUseTime === 0)) {
          carft.standardEfficiency = 0
        } else {
          carft.standardEfficiency = (this.productFrom.baseData.planCpMeters / carft.craftTaskPlanUseTime * 60).toFixed(0)
        }

        produceCrafts.push(carft)
      })

      _data.produceTaskID = this.productFrom.baseData.produceTaskID
      _data.makeup_RollSize = Number(this.productFrom.baseData.makeup_RollSize)
      _data.makeup_DigitalEdition = Number(
        this.productFrom.baseData.makeup_DigitalEdition
      )
      _data.makeup_SkipDistance = Number(
        this.productFrom.baseData.makeup_SkipDistance
      )
      _data.makeup_SpaceBetween = Number(
        this.productFrom.baseData.makeup_SpaceBetween
      )
      _data.makeup_Combine = this.productFrom.baseData.makeup_Combine
      _data.makeup_Modules = this.productFrom.baseData.makeup_Modules
      _data.makeup_PzDz = this.productFrom.baseData.makeup_PzDz
      _data.makeup_Colors = this.productFrom.baseData.makeup_Colors
      _data.produceRemark = this.productFrom.baseData.produceRemark
      _data.planCpMeters = this.productFrom.baseData.planCpMeters
      _data.producePackage = _producePackage
      _data.productTagCodes = productTagCodes
      _data.produceMaterials = produceMaterials
      _data.produceCrafts = produceCrafts

      for (let index = 0; index < produceCrafts.length; index++) {
        produceCrafts[index].produceCraftSort = index+1
        if (produceCrafts[index].produceEquipment === '') {
          this.$message({
            type: 'error',
            message: '请选择生产工艺下的设备名称!'
          })
          return
        }
      }
      for (let index = 0; index < produceCrafts.length; index++) {
        if (produceCrafts[index].craftTaskPlanUseTime === '') {
          this.$message({
            type: 'error',
            message: '请输入计划工时!'
          })
          return
        }
      }
      for (let index = 0; index < produceMaterials.length; index++) {
        if (produceMaterials[index].craftTaskClientNo === '') {
          this.$message({
            type: 'error',
            message: '请选择生产物料下的生产工艺!'
          })
          return
        }
      }
      for (let index = 0; index < produceMaterials.length; index++) {
        if (produceMaterials[index].planUseQuantity === '') {
          this.$message({
            type: 'error',
            message: '请输入计划用料!'
          })
          return
        }
      }
      console.log(_data)
      return
      this.$api.product
        .ExcuteUpdateProduceTaskBill(_data)
        .then((res) => {
          this.$router.go(-1)
        })
        .catch(() => {})
    },
    // 控制标签内容层显示隐藏
    shrink(item) {
      this.$set(item, 'isShow', !item.isShow)
    },
    // 计算产品包装，每箱共计多少枚
    getBoxEqualTags() {
      const pageEqualTagsNum = Number(
        this.productFrom.packageData.pageEqualTags
      )
      const packageEqualPagesNum = Number(
        this.productFrom.packageData.packageEqualPages
      )
      const boxEqualPackagesNum = Number(
        this.productFrom.packageData.boxEqualPackages
      )
      if (this.productFrom.packageData.productStyle !== 2) {
        this.productFrom.packageData.boxEqualTags =
          pageEqualTagsNum * packageEqualPagesNum * boxEqualPackagesNum
      } else {
        this.productFrom.packageData.boxEqualTags =
          pageEqualTagsNum * boxEqualPackagesNum
      }
    },
    // 初始化订单数据
    getInitOrder(oldOrderNo) {},
    // 返回
    Back() {
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
<style lang="scss">
</style>
